/* header start */
 .header {
            height: 44px;
            background-color: #0EB6FF;
            display: flex;
            align-items: center;
        }
        .header .position {
            margin: 0 16px 0 15px;
            /* background-color: pink; */
        }
        .header .position .icon-weizhi {
            font-size: 17px;
            color: #fff;
        }
        .header .search {
            flex: 1;
            /* background-color: aquamarine; */
            position: relative;
        }
        .header .search .input-search {
            border: none;
            height: 30px;
            width: 100%;
            border-radius: 15px;
            padding-left: 35px;
        }
        .header .search .icon-fangdajing {
            font-size: 13px;
            color: #9D9E9D;
            position: absolute;
            top: 9px;
            left: 12px;
        }
        .header .chat {
            margin: 0 11px 0 12px;
            /* background-color: blueviolet; */
        }
        .header .chat .icon-xinxi {
            font-size: 21px;
            color: #fff;
        }
        /* end header */    

        /* menu start */
        .menu {
            /* width: 100%; */
            /* height: 100px; */
            /* background-color: pink; */
        }
        .menu ul {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            column-gap: 18px;
            /* border: 1px solid #000; */
            margin: 16px 8px 1px;
        }
        .menu ul li {
            list-style: none;
            /* background-color: khaki; */
            min-height: 100px;
        }
        .menu ul li .bl1-1 {
            padding-top: 100%;
            background-color: aquamarine;
            border-radius: 50%;
            position: relative;
        }
        .menu ul li .bl1-1.bg1 {
            background-color: aquamarine;
        }
        .menu ul li .bl1-1.bg2 {
            background-color: blueviolet;
        }
        .menu ul li .bl1-1.bg3 {
            background-color: chartreuse;
        }
        .menu ul li .bl1-1.bg4 {
            background-color: coral;
        }
        .menu ul li .bl1-1.bg5 {
            background-color: darksalmon;
        }
        .menu ul li .bl1-1.bg6 {
            background-color: deepskyblue;
        }
        .menu ul li .bl1-1.bg7 {
            background-color: dimgray;
        }
        .menu ul li .bl1-1.bg8 {
            background-color: firebrick;
        }
        .menu ul li .bl1-1.bg9 {
            background-color: forestgreen;
        }
        .menu ul li .bl1-1.bg10 {
            background-color: gold;
        }
        .menu ul li .iconfont {
            /* border: 1px solid #000; */
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 38px;
            color: #fff;
            font-weight: 400;
        }
        
        @media screen and (max-width: 360px) {
            .menu ul li .iconfont {
                font-size: 30px;
            }
        }
        @media screen and (max-width: 360px) {
            .menu ul li .title {
                white-space: nowrap;
                transform: scale(0.8);
            }
            .menu ul {
                column-gap: 8px;
            }
        }
        .menu ul li p {
            /* border: 1px solid #000; */
            margin: 10px 0 16px 0;
            text-align: center;
            font-weight: 400;
        }
        .menu ul li a {
            color: #101010;
        }
        /* end menu */

        /* cheap start */
        .cheap {
            background-color: #fff;
            /* min-height: 100px; */
            border-radius: 10px;
            padding: 15px 10px 12px 10px;
        }
        .cheap-title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            /* background-color: hotpink; */
        }
        .cheap-title .title {
            font-size: 14px;
            font-weight: 400;
            align-items: center;
        }
        .cheap-title .more {
            padding-right: 12px;
            font-size: 12px;
            color: #101010;
            background-image: url(../images/arrow-right.png);
            background-repeat: no-repeat;
            background-position: right center;
            background-size: 5px;
        }
        .cheap .cheap-content {
            /* background-color: khaki; */
            /* min-height: 200px; */
            overflow: hidden;

        }
        .cheap .cheap-content ul {
            width: calc(100% + 26px);
            /* background-color: skyblue; */
            min-height: 100px;
            margin-top: 13px;
        }
        .cheap .cheap-content ul li {
            width: 33.333%;
            float: left;
            min-height: 100px;
            /* border: 1px solid #000; */
            padding-right: 26px;
        }
        .cheap .cheap-content .item-content {
            /* background-color: hotpink; */
            /* min-height: 150px; */
        }
        .bl94-81 {
            padding-top: calc(81/94 * 100%);
            /* background-color: ivory; */
            position: relative;
        }
        .bl94-81 img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
        }
        .cheap-content .item-content p.title {
            margin: 10px 0 12px 0;
            text-align: center;
        }
        .cheap-content .item-content p.title a {
            /* font-size: 12px; */
            color: #101010;
        }
        .cheap-content .item-content p.info {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .cheap-content .item-content .price {
            color: #CE5F41;
        }
        .cheap-content .item-content .price i {
            color: #101010;
            font-style: normal;
        }
        .cheap-content .item-content .cart {
            width: 22px;
            height: 22px;
            background-color: #0EB6FF;
            border-radius: 50%;
            text-align: center;
            line-height: 22px;
            font-size: 12px;
            font-weight: 400;
        }
        .cheap-content .item-content .cart .iconfont {
            font-size: 12px;
            color: #fff;

        }
        /* end cheap */
        
        /* recommend-product start */
        .recommend-product{
            /* min-height: 100px; */
            /* background-color: khaki; */
            margin-top: 20px;
            display: flex;
            column-gap: 9px;

        }
        .recommend-product .product-item{
            background-color: #fff;
            flex:1;
            /* min-height: 100px; */
            /* border: 1px solid #000; */
            border-radius: 5px;
            padding: 15px 0 12px 0;
            min-width: 0;

        }
        .recommend-product .product-item .title{
            margin-left:13px;
            font-size: 14px;
            font-weight: bold;

        }
        .recommend-product .product-item .desc{
            margin: 10px 0 7px 12px;
            color: #9D9E9D;
            /* line-height: 1.5; */
        }
        .product-item ul{
            display: flex;
            padding: 0 15px;
            column-gap: 21px;
        }
            
        .product-item ul li{
            /* min-height: 100px; */
            /* border: 1px solid #000; */
            flex:1;
        }
        .bl1-1{
            padding-top: 100%;
            /* background-color: #f00; */
            position: relative;
        }
        .bl1-1 img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            left: 0;
        }
        /* end recommend-product */

        /* product-category start */
        .product-category {
            padding-bottom: 55px;
        }

        .product-category .tab-header {
            /* min-height: 100px; */
            background-color: #f5f5f5;
            padding: 23px 0 12px;
        }

        .product-category .tab-content {
            /* min-height: 500px; */
            /* background-color: pink; */
        }

        .tab-header .swiper-wrapper {
            justify-content: between;
        }

        .tab-header .swiper-slide {
            /* border: 1px solid #000; */
            width: auto;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .tab-header .swiper-slide .title {
            font-size: 16px;
            font-weight: 400;
            margin-bottom: 10px;
            text-align: center;
        }

        .tab-header .swiper-slide .desc {
            display: block;
            width: 63px;
            height: 17px;
            /* background-color: khaki; */
            text-align: center;
            line-height: 17px;
            color: #9D9E9D;
            border-radius: 9px;
        }

        .tab-header .swiper-slide.swiper-slide-thumb-active p {
            color: #0EB6FF;
        }

        .tab-header .swiper-slide.swiper-slide-thumb-active .desc {
            background-color: #0EB6FF;
            color: #fff;
        }

        .product-category .tab-content .swiper-slide {
            /* min-height: 400px; */
            /* background-color: slateblue; */
        }

        .product-category .tab-content .tab-content-item {
            /* background-color: aliceblue; */
            /* min-height: 100px; */
            border-radius: 5px;
            display: flex;
            padding-bottom: 14px;
            background-color: #fff;
        }

        .tab-content .swiper-wrapper ul {
            display: flex;
            flex-direction: column;
            row-gap: 10px;
        }

        .tab-content .tab-content-item .img {
            width: calc(103/353*100%);
            /* min-height: 100px; */
            /* background-color: aquamarine; */
            padding: 23px 0 0 9px;
        }

        .tab-content .tab-content-item .info {
            width: calc(250/353*100%);
            /* min-height: 100px; */
            /* background-color: blueviolet; */
            padding-left: 14px;
        }

        .tab-content-item .info p.title {
            padding-top: 15px;
            color: #101010;
            font-size: 14px;
            height: 52px;
            padding-right: 14px;
        }

        .tab-content-item .info .marks {
            display: flex;
            column-gap: 5px;
        }

        .tab-content-item .info .marks .mark {
            color: #9D9E9D;
            border: 1px solid #9D9E9D;
            padding: 3px 5px;
            border-radius: 5px;
        }

        .tab-content-item .info .marks .mark.active {
            color: #CE5F41;
            border-color: #CE5F41;
        }

        .tab-content-item .info .price-cart {
            display: flex;
            justify-content: space-between;
            align-items: center;
            /* border: 1px solid skyblue; */
            align-items: center;
            margin-top: 4px;
            margin-right: 14px;
        }

        .tab-content-item .info .price-cart .price {
            color: #CE5F41;
            font-size: 16px;
            font-family: Arial;
            font-weight: 400;
        }

        .tab-content-item .info .price-cart .price i {
            color: #010101;
            font-style: normal;
        }

        .tab-content-item .info .price-cart .cart {
            width: 22px;
            height: 22px;
            background-color: #0EB6FF;
            font-size: 14px;
            text-align: center;
            line-height: 22px;
            color: #fff;
            font-weight: 400;
            border-radius: 50%;
        }

        .tab-content-item .info .count {
            color: #9D9E9D;
            margin-top: 7px;
            /* font-size: 12px; */
            font-weight: 400;
        }
        /* end product-category */

        /* tabber start */
        .tabber{
            height: 50px;
            /* background-color: khaki; */
            display: flex;
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            z-index: 10;
            padding-bottom: 20px;
            padding-bottom: constant(safe-area-inset-bottom);
            padding-bottom: env(safe-area-inset-bottom);
        }
        .tabber ul {
            width: 100%;
            background-color: #fff;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .tabber ul li{
            flex: 1;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-top: 5px;
        }
        .tabber ul li a .iconfont{
            font-size: 22px;
            color: #010101;
            font-weight: 400;
        }
        .tabber ul li p{
            color: #9D9E9D;
            padding-top: 5px;
        }
        .tabber ul li.active p{
            color: #0EB6FF;
        }
        .tabber ul li.active .iconfont{
            color: #0EB6FF;
        }
        /* end tabber */